<template>
	<Container>
		<view class="clock-in-index">
			<view class="poster-box">
				<view class="poster">
					<view class="title">记账成就</view>
					<image class="avatar" src="/static/logo.png" mode=""></image>
				</view>
			</view>
			<view class="controls">
				
			</view>
		</view>
	</Container>
	
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
.clock-in-index {
	min-height: 100vh;
	background-color: #f9f9f9;
	display: flex;
	flex-direction: column;
	.poster-box {
		flex: 1;
		width: 100vw;
		display: flex;
		justify-content: center;
		align-items: center;
		.poster {
			width: 600rpx;
			height: 900rpx;
			background-color: #fff;
			border-radius: 16rpx;
			box-shadow: 0 10rpx 40rpx -10rpx #b8bdcb;
			padding: 32rpx;
			.title {
				font-size: 32rpx;
				color: #555;
				text-align: center;
				
			}
			
			.avatar {
				width: 150rpx;
				height: 150rpx;
				border-radius: 100%;
				display: block;
				margin: 50rpx auto;
			}
			
		}
	}
	.controls {
		width: 100vw;
		height: 200rpx;
		background-color: #fff;
	}
}
</style>
